"use strict";
// 1. class的基本用法 继承和类型约束
class Dom {
    constructor() {
    }
    createElement(el) {
        return document.createElement(el);
    }
    setText(el, text) {
        el.textContent = text;
    }
    render(createElement) {
        const el = this.createElement(createElement.tag);
        if (createElement.children && Array.isArray(createElement.children)) {
            createElement.children.forEach(item => {
                const child = this.render(item);
                el.appendChild(child);
            });
        }
        else if (createElement.text) {
            this.setText(el, createElement.text);
        }
        return el;
    }
}
class Vue extends Dom {
    constructor(options) {
        super();
        this.options = options;
        this.init();
    }
    init() {
        let app = typeof this.options.el === 'string' ? document.querySelector(this.options.el) : this.options.el;
        let data = {
            tag: "div",
            props: {
                id: 1,
                key: 1
            },
            children: [
                {
                    tag: "div",
                    text: "子集1",
                },
                {
                    tag: "div",
                    text: "子集2"
                },
                {
                    tag: "div",
                    text: "子集3"
                }
            ]
        };
        app === null || app === void 0 ? void 0 : app.appendChild(this.render(data));
        console.log(app);
        this.mount(app);
    }
    mount(app) {
        document.body.append(app);
    }
}
const v = new Vue({
    el: '#app'
});
